<template>
  <div>
    <a href="/demo3.html">demo3</a>
    <div id="map" ref="rootmap">

    </div>
  </div>

</template>

<script>
import "ol/ol.css";
import { Map } from "ol";
import mapconfig from './Demo2.js'
import {
  FullScreen, // 全屏控件
  Attribution
} from "ol/control"


export default {
  data () {
    return {
      map: null
    };
  },
  mounted () {
    this.map = new Map({
      target: "map",
      controls: [new FullScreen(), new Attribution()],
      layers: mapconfig.mapLayerArr(), // 图层
      view: mapconfig.view()
    });
    this.map.addInteraction(mapconfig.draw())
  }
};
</script>

<style>
#map {
  height: 600px;
}
</style>